<template>
<div class="body">
  <div class="main">
    <el-row>
            <el-col :span="24" >
              <el-divider></el-divider>
                <el-card :body-style="{ padding: '20px'}" class="block" >
                <el-container>
                  <el-aside class="EAside">
                    <el-container>
                      <el-header height="220px">
                        <div style="border: 2px solid #920;height:200px;width:230px;box-shadow: 0 25px 12px rgba(0, 0, 0, .12), 0 0 6px rgba(0, 0, 0, .04)">
                        <img :src="achpicurl" class="image">
                        </div>
                      </el-header>
                      <el-main class="Pmain" style="text-align: left; font-size: 24px">
                        <el-col :offset="0">
                        <span class="el-icon-coin" style="color:#409EFF">{{achprice}}</span>
                        </el-col>
                        
                      </el-main>
                      <el-footer style="text-align: left; font-size:14px;color:#606266">
                        <el-divider class="divider-1"></el-divider>
                        <el-col :span="24">
                        <span class="tt-p">所持有者：</span>{{achown}}
                        </el-col>
                        <el-col :span="24">
                        <span class="tt-p">联系方式：</span>{{achcontact}}
                        </el-col>
                        <el-col :span="24">
                        <span class="tt-p">联系邮箱：</span>{{achmail}}
                        </el-col>
                        <el-col :span="24">
                        <span class="tt-p">转化意愿：</span>{{transinten}}
                        </el-col>
                      </el-footer>
            
                    </el-container>
                  </el-aside>
                    <el-main class="EMain">
                      <el-container>
                        <el-header style="font-size: 20px" height="75px">
                          <el-row >
                            <el-col :span="24"><span><h4>{{achname}}</h4></span></el-col>
                          </el-row>
                        </el-header>
                        <el-main style="text-align: left; font-size: 14px;color:#606266"> 
                          <el-col :span="24"><div class="text-st"></div><span class="tt">发布时间：</span>{{achdate}}</el-col>
                          <el-col :span="24"><div class="text-st"></div><span class="tt">成果类型：</span>{{achtype}}</el-col>
                          <el-col :span="24"><div class="text-st"></div><span class="tt">专利编号：</span>{{achpubno}}</el-col>
                        </el-main>
                        <el-footer style="text-align: left; font-size: 14px;">
                            <el-col :span="24"><div class="text-st"></div><span class="tt">成果领域：</span>{{achfield}}</el-col>
                            <el-col :span="24"><div class="text-st"></div><span class="tt">成果行业：</span>{{achindu}}</el-col>
                            <el-col :span="24"><div class="text-st"></div><span class="tt">成果阶段：</span>{{achphase}}</el-col>
                            <el-col :span="24"><div class="text-st"></div><span class="tt">法律状态：</span>{{lawstatus}}</el-col>

                        </el-footer>
                      </el-container>
                    </el-main>
                </el-container>
                </el-card>
                </el-col>
                
                </el-row>
              <el-row class="botblock">
              <el-col :span="12">
                <!-- <div class="grid-content bg-purple">asd</div> -->
                <el-card :body-style="{ padding: '5px'}" class="block-2" >
                    <el-container>
                      <el-header style="text-align: left;" class="el-head">
                        <el-row >
                          <el-col :span="24"><span ><h2><i class="el-icon-notebook-2"></i>  成果说明</h2></span></el-col>
                        </el-row>
                      </el-header>
                      
                      <el-footer style="font-size:14px;color:#606266">
                        <el-divider class="divider-1"></el-divider>
                          <el-col :span="24" style="text-align:left;"><span style="white-space:normal;line-height:20px">{{achremark}}</span></el-col>
                          
                      </el-footer>
                    </el-container> 
                </el-card>
              </el-col>
              <el-col :span="12">
                <!-- <div class="grid-content bg-purple-light">asd</div> -->
                <el-card :body-style="{ padding: '5px'}" class="block-2" >
                  <el-container>
                    <el-header style="text-align: left;" class="el-head">
                      <el-row >
                        <el-col :span="24"><span ><h2><i class="el-icon-s-flag"></i>  应用要求</h2></span></el-col>
                      </el-row>
                    </el-header>
                    
                    <el-footer style="font-size:14px;color:#606266">
                      <el-divider class="divider-1"></el-divider>
                        <el-col :span="24" style="text-align:left"><span style="white-space:normal;line-height:20px;">{{achrelarequire}}</span></el-col>
                        <!-- <el-col :span="24" style="text-align:left"><div class="text-st"></div><span >{{}}</span></el-col> -->
                    </el-footer>
                  </el-container> 
                </el-card>
              </el-col>
            </el-row>
            <el-row>
            <el-col :span="24" >
                <el-card :body-style="{ padding: '5px'}" class="block-3" >
                  <el-header style="text-align: left;" class="el-head">
                    <el-row >
                      <el-col :span="24"><span ><h2><i class="el-icon-s-finance"></i> 交易流程</h2></span></el-col>
                    </el-row>
                  </el-header>
                  <el-footer>
                    <img src="../../../src/assets/exchange.png" class="image-2">
                  </el-footer>
                </el-card>
                </el-col>
                </el-row>
  </div>
</div>
</template>

<script scoped>
import SandTAchievements from "../SandTAchievements.vue"
export default {
  name: 'Achdetail',
  
  data () {
    return {
      achname:this.$route.query.achname,
      achtype:this.$route.query.achtype,
      achdate:this.$route.query.achdate,
      achprice:this.$route.query.achprice,
      achfield:this.$route.query.achfield,
      achindu:this.$route.query.achindu,
      achremark:this.$route.query.achremark,
      achrelarequire:this.$route.query.achrelarequire,
      achown:this.$route.query.achown,
      achcontact:this.$route.query.achcontact,
      achmail:this.$route.query.achmail,
      achpubno:this.$route.query.achpubno,
      lawstatus:this.$route.query.lawstatus,
      achphase:this.$route.query.achphase,
      transinten:this.$route.query.transinten,
      achpicurl:this.$route.query.achpicurl,
    }
  },
  
}
</script>

<style scoped>
  .tt{
    font-size: 16px;
    color:#303133;
  }
  .tt-p{
    font-size: 14px;
    color: #303133;
  }
  .body{
    width: 100%;
    background-color: rgb(243, 245, 245);
  }
  .divider-1{
    width: 120px;
  }
  .image-2{
    margin-left: auto;
      margin-right: auto;
      /* margin-top: 5%; */
      width: 810px;
      height: 180px;
      
  }
  .botblock{
    width: 820px;
    margin-left:auto;
    margin-right: auto;
    margin-bottom: 1%;
  }
  .main{
    width: 1180px;
    margin-left:auto;
    margin-right: auto;
  }
  .text-st{
    margin-bottom: 22px;
  }
  .el-head {
    background-color: #f5cf95;
    color: #333;
    line-height: 10px;
  }
  /* .el-row{
    margin-bottom: 10px;
  } */
  .Pmain{
    height: 30px;
  }
  
  .block{
      margin-left: auto;
      margin-right: auto;
      margin-top: 5%;
      width: 810px;
      height: 420px;
      /* border: 1px solid rgb(143, 145, 145); */
      box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
      
  }
  .block-2 /deep/{
      margin-left: auto;
      margin-right: auto;
      margin-top: 15px;
      width: 400px;
      height: 400px;
  }
  .block-3{
    margin-left: auto;
    margin-right: auto;
    width: 810px;
    height: 230px;
    margin-bottom: 2%;
    /* border: 1px solid rgb(143, 145, 145); */
    box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
  }
  .image {
    width: 230px;
    height: 200px;
    display: block;
    /* box-shadow: 0 25px 12px rgba(0, 0, 0, .12), 0 0 6px rgba(0, 0, 0, .04) */
  }
  .EAside{
    height: 400px;
  }
  /* .EMain{
    width:60%;
    display: block;
  } */
  .card-p{
    margin-right: 0px;
  }
  
</style>

